<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="pragram" content="no-cache"/>
    <meta http-equiv="cache-control" content="no-cache, must-revalidate"/>
    <meta http-equiv="expires" content="0"/>
    <meta name="renderer" content="webkit"/>
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>数据分析</title>
    <link rel="stylesheet" href="/assets/css/lib/bootstrap.min.css">
    <link rel="stylesheet" href="/assets/css/lib/pagination.css">
    <link rel="stylesheet" href="/assets/css/common.css">
    <link rel="stylesheet" href="/assets/css/data_analyse.css">
</head>
<body>
<div id="cms">
    <jsp:include page="title_bar.jsp"/>
    <jsp:include page="tab_bar.jsp"/>
    <div class="cms-content">
        <div class="current-place">
            <div class="place-title">当前位置:</div>
            <div class="place-val">首页/数据分析</div>
        </div>
        <div class="seek-box">
            <div class="common-title">
                <div class="common-left-line"></div>
                <div class="common-text">数据分析条件</div>
            </div>
            <div class="seek-content">
                <div class="seek-two bgf9">
                    <div class="seek-two-left">客户基本信息</div>
                    <div class="seek-two-right">
                        <div class="seek-two-top">
                            <div class="seek-unit">
                                <span class="seek-unit-left">客户姓名</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="form-control client-name">
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">客户手机号码</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="form-control client-phone-num">
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">手机号归属地</span>
                                <div class="seek-unit-right">
                                    <div id="distpicker1" class="distpicker">
                                        <div class="form-group">
                                            <select class="form-control province"></select>
                                        </div>
                                        <div class="form-group">
                                            <select class="form-control city"></select>
                                        </div>
                                        <div class="form-group">
                                            <select class="form-control district"></select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">当前捆绑律师</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="form-control current-lawyer">
                                </div>
                            </div>
                        </div>
                        <div class="seek-two-bottom">
                            <div class="seek-unit">
                                <span class="seek-unit-left">创建时间</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="Wdate " id="create-start"/>
                                    <span>-</span>
                                    <input type="text" class="Wdate " id="create-end"/>
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">首次咨询时间</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="Wdate " id="first-consult-start"/>
                                    <span>-</span>
                                    <input type="text" class="Wdate " id="first-consult-end"/>
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">末次咨询时间</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="Wdate " id="last-consult-start"/>
                                    <span>-</span>
                                    <input type="text" class="Wdate " id="last-consult-end"/>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="seek-one bgff" style="display: none">
                    <div class="seek-one-left">客户来源信息</div>
                    <div class="seek-one-right">
                        <div class="seek-unit">
                            <span class="seek-unit-left">顶级渠道名称</span>
                            <div class="seek-unit-right">
                                <input type="text" class="form-control promotion-name">
                            </div>
                        </div>
                        <div class="seek-unit">
                            <span class="seek-unit-left">一级渠道名称</span>
                            <div class="seek-unit-right">
                                <input type="text" class="form-control first-promotion-name">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="seek-one bgf9 call-info">
                    <div class="seek-one-left">通话信息</div>
                    <div class="seek-one-right">
                        <div class="seek-unit">
                            <span class="seek-unit-left">通话效果</span>
                            <div class="seek-unit-right">
                                <select class="form-control call-time">
                                    <option value="">全部</option>
                                    <option value="0">无效</option>
                                    <option value="1">有效</option>
                                    <option value="2">优质</option>
                                </select>
                            </div>
                        </div>
                        <div class="seek-unit">
                            <span class="seek-unit-left">通话结果</span>
                            <div class="seek-unit-right">
                                <select class="form-control call-result">
                                    <option value="">全部</option>
                                    <option value="1#1">主叫方挂断</option>
                                    <option value="1#2">被叫方挂断</option>
                                    <option value="2#1">主叫方未接通</option>
                                    <option value="2#2">被叫方未接通</option>
                                    <option value="3#1">主叫方拒接</option>
                                    <option value="3#2">被叫方拒接</option>
                                    <option value="4#">拨打失败</option>
                                    <option value="5#">异常状态</option>
                                </select>
                            </div>
                        </div>
                        <div class="seek-unit">
                            <span class="seek-unit-left">咨询发起方</span>
                            <div class="seek-unit-right">
                                <select class="form-control consult-bearing">
                                    <option value="">全部</option>
                                    <option value="1">律师</option>
                                    <option value="0">客户</option>
                                </select>
                            </div>
                        </div>
                        <div class="seek-unit">
                            <span class="seek-unit-left">咨询发起时间</span>
                            <div class="seek-unit-right">
                                <input type="text" class="Wdate " id="consult-time-start"/>
                                <span>-</span>
                                <input type="text" class="Wdate " id="consult-time-end"/>
                            </div>
                        </div>
                        <div class="seek-unit">
                            <span class="seek-unit-left">咨询发起位置</span>
                            <div class="seek-unit-right">
                                <select class="form-control consult-place">
                                    <option value="">全部</option>
                                    <option value="1">法海问法</option>
                                    <option value="6">手机M站</option>

                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="seek-two bgff">
                    <div class="seek-two-left">服务律师信息</div>
                    <div class="seek-two-right">
                        <div class="seek-two-top">
                            <div class="seek-unit">
                                <span class="seek-unit-left">律师姓名</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="form-control lawyer-name">
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">律师手机号码</span>
                                <div class="seek-unit-right">
                                    <input type="text" class="form-control lawyer-phone-num">
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">律师服务地区</span>
                                <div class="seek-unit-right">
                                    <div id="distpicker2" class="distpicker">
                                        <div class="form-group">
                                            <select class="form-control province" id="aprovince"></select>
                                        </div>
                                        <div class="form-group">
                                            <select class="form-control city" id="acity"></select>
                                        </div>
                                        <div class="form-group">
                                            <select class="form-control district" id="adistrict"></select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="seek-two-bottom">
                            <div class="seek-unit">
                                <span class="seek-unit-left">律师类型</span>
                                <div class="seek-unit-right">
                                    <select class="form-control lawyer-type" disabled="true">
                                        <option value="">全部</option>
                                        <option value="">直营</option>
                                        <option value="">众包</option>
                                        <option value="">共青团律师</option>
                                    </select>
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">律师隶属组</span>
                                <div class="seek-unit-right">
                                    <select class="form-control lawyer-belong-group" disabled="true">
                                        <option value="">全部</option>
                                        <option value="">共青团律师</option>
                                        <option value="">法海网</option>
                                    </select>
                                </div>
                            </div>
                            <div class="seek-unit">
                                <span class="seek-unit-left">律师状态</span>
                                <div class="seek-unit-right">
                                    <select class="form-control lawyer-status">
                                        <option value="">全部</option>
                                        <option value="1">上线</option>
                                        <option value="0">未上线</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="seek-btn-group">
                    <div class="btn-box">
                        <div class="char-btn" onclick="javascrpit:window.location.href='/chart/list'">图形报表</div>
                        <div class="search-btn"> 查询</div>
                        <div class="clear-btn">清空条件</div>
                        <div class="exportxls" onclick="exportxls()">导出excel</div>
                    </div>
                </div>
            </div>
        </div>

        <div class="cms-sub-content clearfix">
            <div class="table-util">
                <div class="common-title">
                    <div class="common-left-line"></div>
                    <div class="common-text">数据总表</div>
                </div>
                <div class="table-box">
                    <table class="table table-bordered">
                        <thead>
                        <tr>
                            <th>客户总个数</th>
                            <th>通话总个数</th>
                            <th>通话总时长（秒）</th>
                            <th>有效通话个数</th>
                            <th>服务律师总个数</th>
                        </tr>
                        </thead>
                        <tbody id="tbody0">

                        </tbody>
                        <script id="list0" type="text/html">
                            <!for(k in result){
                            var v=result[k];
                            !>
                            <tr>
                                <td class="clientSum"><!=v.clientSum==null?'' :v.clientSum!></td>
                                <td class="callSum"><!=v.callSum==null?'':v.callSum!></td>
                                <td class="callTimeSum"><!=v.callTimeSum==null?'':v.callTimeSum!></td>
                                <td class="effectiveSum"><!=v.effectiveSum==null?'':v.effectiveSum!></td>
                                <td class="lawyerSum"><!=v.lawyerSum==null?'':v.lawyerSum!></td>
                            </tr>
                            <!}!>
                        </script>

                    </table>
                </div>
            </div>
        </div>
        <div class="cms-container">
            <div class="pagination-box clearfix">
                <div class="pagination-unit pagination-unit-active">客户基本信息</div>
                <div class="pagination-unit">通话信息</div>
                <div class="pagination-unit">服务律师信息</div>
            </div>
            <div class="slider-box">
                <div class="slider-container clearfix">
                    <div class="slider-unit">
                        <div class="table-box">
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th>行号</th>
                                    <th>客户ID</th>
                                    <th>客户姓名/昵称</th>
                                    <th>客户手机号码</th>
                                    <th>号码归属地</th>
                                    <th>当前捆绑律师</th>
                                    <th>首次咨询时间</th>
                                    <th>末次咨询时间</th>
                                    <th>客户创建时间</th>
                                </tr>
                                </thead>
                                <tbody id="tbody1">

                                </tbody>
                                <script id="list1" type="text/html">
                                    <!for(k in result){
                                    var v=result[k];
                                    !>
                                    <tr>
                                        <td class="rowno"><!=v.rowno!></td>
                                        <td class="wxopenid"><!=v.wxopenid==null?'' :v.wxopenid !></td>
                                        <td class="uname"><!=v.uname==null?'':v.uname!></td>
                                        <td class="uphone"><!=v.uphone==null?'':v.uphone!></td>
                                        <td class="uphoneArea"><!=v.uphoneArea==null?'':v.uphoneArea!></td>
                                        <td class="lawyername"><!=v.lawyername==null?'':v.lawyername!></td>
                                        <td class="firstTimetr"><!=v.firstTimetr==null?'':v.firstTimetr!></td>
                                        <td class="lastTimeStr"><!=v.lastTimeStr==null?'':v.lastTimeStr!></td>
                                        <td class="createTimeStr"><!=v.createTimeStr==null?'':v.createTimeStr!></td>
                                    </tr>
                                    <!}!>
                                </script>
                            </table>
                        </div>
                    </div>
                    <div class="slider-unit">
                        <div class="table-box">
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th>行号</th>
                                    <th>通话时长</th>
                                    <th>通话结果</th>
                                    <th>咨询有效性</th>
                                    <th>咨询发起方</th>
                                    <th>咨询发起时刻</th>

                                </tr>
                                </thead>
                                <tbody id="tbody3">

                                </tbody>
                                <script id="list3" type="text/html">
                                    <!for(k in result){
                                    var v=result[k];
                                    !>
                                    <tr>
                                        <td class="rowno"><!=v.rowno!></td>
                                        <td class="calledDuration"><!=v.calledDuration==null?'':v.calledDuration!></td>
                                        <td class="callStatusStr"><!=  backCallState(v.callStatus,v.rejectStatus) !></td>
                                        <td class="isEffectiveStr"><!=v.isEffectiveStr==null?'':v.isEffectiveStr!></td>
                                        <td class="initiatorStr"><!=v.initiatorStr==null?'':v.initiatorStr!></td>
                                        <td class="startTimeStr"><!=v.startTimeStr==null?'':v.startTimeStr!></td>
                                    </tr>
                                    <!}!>
                                </script>
                            </table>
                        </div>
                    </div>
                    <div class="slider-unit">
                        <div class="table-box">
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th>行号</th>
                                    <th>律师ID</th>
                                    <th>律师姓名</th>
                                    <th>律师电话</th>
                                    <th>律师状态</th>
                                </tr>
                                </thead>
                                <tbody id="tbody4">

                                </tbody>
                                <script id="list4" type="text/html">
                                    <!for(k in result){
                                    var v=result[k];
                                    !>
                                    <tr>
                                        <td class="rowno"><!=v.rowno!></td>
                                        <td class="alawyerid"><!=v.alawyerid==null?'':v.alawyerid!></td>
                                        <td class="alawyername"><!=v.alawyername==null?'' :v.alawyername!></td>
                                        <td class="alawyerPhone"><!=v.alawyerPhone==null?'':v.alawyerPhone!></td>
                                        <td class="lawyerStatesStr"><!=v.lawyerStatesStr!></td>
                                    </tr>
                                    <!}!>
                                </script>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="pagination-wrap clearfix">
            <div id="Pagination" class="pagination"><!-- 这里显示分页--></div>
        </div>

    </div>
</div>

</div>

</body>
<script type="text/javascript" src="/assets/js/lib/jquery-1.12.3.js"></script>
<script type="text/javascript" src="/assets/js/lib/bootstrap.min.js"></script>
<script type="text/javascript" src="/assets/js/lib/modal.js"></script>
<script type="text/javascript" src="/assets/js/lib/cmsmodal.js"></script>

<script type="text/javascript" src="/assets/js/lib/distpicker.data.js"></script>
<script type="text/javascript" src="/assets/js/lib/distpicker.js"></script>
<script type="text/javascript" src="/assets/js/lib/jquery.pagination.js"></script>

<script type="text/javascript" src="/assets/js/lib/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="/assets/js/common.js"></script>
<script type="text/javascript" src="/assets/js/communal/template.js"></script>
<script type="text/javascript" src="/assets/js/data_analyse.js"></script>
</html>